class lazyLoad {
    // constructor
    constructor(selector) {
        console.log(this)
        this.imgs = Array.from(document.querySelectorAll(selector))
        this.top_offset = this.imgs.map((item) => this.getAbsoluteTop(item))
        this.bindEvent()
        window.dispatchEvent(new Event("scroll"))
    }

    // All events in here
    bindEvent() {
        window.addEventListener("scroll", () => {
            for (let i = 0; i < this.top_offset.length; i++) {
                if (this.top_offset[i] <= scrollY + innerHeight) {
                    let img = new Image()
                    img.src = this.imgs[i].getAttribute("data-src")
                    img.onload = () => {
                        this.imgs[i].src = this.imgs[i].getAttribute("data-src")

                    }
                }
            }
        })
    }

    // getAbsoluteTop
    getAbsoluteTop(dom) {
        if (dom.offsetParent !== document.body) {
            return dom.offsetTop + this.getAbsoluteTop(dom.offsetParent)
        }
        return dom.offsetTop
    }
}